<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="css/order/orderFourth.css" rel="stylesheet" type="text/css" />
<title>支付</title>
<script src="js/jquery-3.2.1.js"></script>
<script type="text/javascript">
$(function(){
    
    var address_id = 0;
    var price = 0.0;
    //为新增姓名表单添加事件
    $(".renter_name").change(function(){
        var reg =  /^[\u4e00-\u9fa5]{0,}$/;
        var s = $(this).val();
        var flag = true;
         if(!reg.test(s)||s==""){
            flag = false;
             $(this).val("");
                alert("请输入中文");
                return;
        }else if(s==null||s==""){
            alert("输入内容不得为空");
            return;
        }
    });
    
    //为新增身份证号码添加事件
    $(".idcard").change(function(){
         var idcard = $(this).val();
         var regIdCard=/^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/;
         if(!regIdCard.test(idcard)){
             $(this).val("");
             alert("该身份证没有通过验证");
             return;
         }
    });
    $(".renter_type").change(function(){
        var type = $(this).val();
        var phone = /^1(3|4|5|7|8)\d{9}$/;
        if(!phone.test(type)){
             $(this).val("");
            alert("手机号码有误！请重新填写");
            return;
        }
    });
    
    //为提交按钮绑定*
    $(".add_renter_sub").click(function(){
        var a = $(".renter_name").val();
        var b = $(".idcard").val();
        var c= $(".renter_type").val();
        if(a==""||b==""||c==""){
            alert("您尚有信息未完成");
        }else{
            //$("this").submit();
          $.ajax({
         type:"post",
         datatype:"json",
         url:"fourdeal",
         data:{name2:a, idcard2:b, phone2:c},
         success:function(e1){
            alert(JSON.stringify(e1));
            location.href = "orderFourth";
          }
          });
            
      
        }

      });
    
    //为单选框添加点击事件
    $("input[name=a]").click(function(){
        address_id = $(this).val();
    });
    
    //为修改订单按钮添加点击事件
    $(".esinf_a-b-a-d-1").click(function(){
        location.href="fastorder";
    });
    
    //为确认订单按钮添加点击事件
    $(".esinf_a-b-a-d").click(function(){
          var span = $(".esinf_a-b-a-b");
          var price = $("#zuce").attr("value");
          var usid = $("#xq").val();
          var a1 = $("#ss").val();
          var a2 = $("#ss2").val();
          var a3 = $("#ss3").val();
          var a4 = $("#ss4").val();
          var comment = $("#bz").val();
          var getcar = a1+" "+a3;
          var backcar = a2+" "+a4;
          var fuwu = $("#fuwu").attr("value");
          if(address_id==0){
        	  alert("请选择用户进行租赁");
        	  return;
          }
          if(a2==""||a4==""){
        	  if(confirm("您未选择具体时间，取车时间和还车时间默认为0点0分，是否继续?")){
        		      price = $("#zuce").attr("jiage");
        		     $.ajax({
        		    	 type:"get",
        		    	 datatype:"json",
        		    	 url:"orderfifth",
        		    	 data:{address_id:address_id,prices:price,fuwu:fuwu,nr:comment},
        		    	 success:function(e3){
        		    		   alert(JSON.stringify(e3));
        		    		   if(e3=="预订成功"){
        		    			   location.href = "/fuhe/checkorder";
        		    		   }
        		    		   //若未成功
        		    		   else{
        		    			   return;
        		    		   }
        		    	 }
        		     });
                     // location.href="orderfifth?address_id="+orderfifth+"&prices="+price+"&fuwu="+fuwu+"&nr="+comment;  
        	  }else{
        		  return;
        	  }
          }
          //若确定了时间传参数
          else{
        	  $.ajax({
                  type:"get",
                  datatype:"json",
                  url:"orderfifth",
                  data:{address_id:address_id,prices:price,fuwu:fuwu,nr:comment,gd:getcar,bd:backcar},
                  success:function(e4){
                        alert(JSON.stringify(e4));
                        if(e4=="预订成功"){
                            location.href = "/fuhe/checkorder";
                        }
                        //若未成功
                        else{
                            //转发到个人中心
                            location.href = "/fuhe/pmain";
                        }
                  }
              });
        	 // location.href="orderfifth?address_id="+address_id+"&prices="+price+"&fuwu="+fuwu+"&nr="+comment+"&gd="+getcar+"&bd="+backcar;
          }
          
        
    });
   
  
   
})
</script>
</head>
<body>
<jsp:include page="../public/header.jsp"></jsp:include>
<jsp:include page="../public/date.jsp"></jsp:include>
    <div class="header">
        <div class="mainbox">
            <div class="esinf">
                <div class="esinf_a">
                    <div class="esinf-a">基本信息</div>
                    <div class="esinf-b"></div>
                </div>
                <div class="clear esinf-c">
                    <div class="clear esinf-c-a">
                        <img
                            src="${c.img1 }" />
                    </div>
                    <div class="xianxi-a-b">
                        <div class="xianxi-a-b-a">${c.name }</div>
                        <div class="xianxi-a-b-b">
                            <ul>
                                 <li><span>车系</span> ${c.series }</li>
                                <li><span>年代款</span> ${c.time }</li>
                                <li><span>配置款</span> 典雅型</li>
                                <li><span>座位数</span> ${c.seat }</li>
                                <li><span>燃料类型</span> ${c.fuel_type }</li>
                                <li><span>变速箱类型</span> ${c.gearbox }</li>
                                <li><span>排量</span> ${c.displacement }</li>
                                <li><span>燃油标号</span> ${c.fuel_label }</li>
                                <li><span>天窗</span>${c.state }</li>
                                <li><span>油箱容量</span> ${c.fuel_tank }</li>
                                <li><span>音响</span> 8</li>
                                <li><span>座椅</span> 皮革座椅</li>
                                <li><span>倒车雷达</span> 有</li>
                                <li><span>气囊</span> 有</li>
                                <li><span>GPS导航</span> 有</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="clear esinf-d">选择租车人信息</div>
                <div class="clear esinf-e">
                    <ul>
                       <c:forEach items="${lsa }" var="lsa2">
                       <li><input type="radio" name="a" id="xq" value="${lsa2.address_id }" />
                           租车人姓名:${lsa2["name"] }-联系电话：${lsa2.phone }-身份证号码:${lsa2.idcard }</li>
                       </c:forEach>
                        
                        
                    </ul>
                    <div class="clear esinf-e-a">
                        <form action="" method="post" class="esinf-e-a-a">
                            姓名： <input type="text" value="" class="renter_name" name="name" /> 
                            身份证号码： <input type="text" value="" class="idcard" name="idcard" />
                            联系电话： <input type="text" value="" class="renter_type"  name="phone"/>
                            <input type="button" class="add_renter_sub" value="新增联系人信息" style="margin-top:50px;">
                        </form>
                        
                    </div>
                </div>
            </div>
           
            <div class="margin esinf">
                <div class="esinf_a">
                    <div class="esinf-a">费用明细</div>
                    <div class="esinf-b"></div>
                </div>
                <div class="esinf_a-a">
                   车辆租赁费<span class="esinf_a-b-a-b22" id="zuce" jiage="${minus_day*c.price }" value="${c.price }">${ c.price}元X${minus_day}天=${minus_day*c.price }元</span><br />
                   保险费用<span class="esinf_a-b-a-b22" id="baoxian" value="50">50元</span><span>（注：必收）</span><br />
                   服务费用<span id="fuwu" class="esinf_a-b-a-b22"  value="${service }">${service }元</span><span>（注：若租车和还车门店不一致则需要收取）</span><br />
                    备注信息 <br />
                    <textarea id="bz"></textarea>
                </div>
                <div class="esinf_a-b">
                    <div class="esinf_a-b-a mainbox"  >
                       <div class="wz">
                        应付金额： <span class="esinf_a-b-a-a"> ￥<span
                        name="jiage"    class="esinf_a-b-a-b"  price="${c.price }">${c.price*minus_day+service+50 }元</span>
                        </span>
                        </div>
                        <ul class="but">
                    <li>
                    <input
                        type="button" class="esinf_a-b-a-d-1" value="修改订单"  />
                     </li>
                     <li>
                     <input
                        type="button" class="esinf_a-b-a-d" value="提交订单" />
                    </li>
                    </ul>    
                    </div>
                 
                </div>
            </div>
        </div>
    </div>
</body>
</html>